{extend name="panel/layout" /}
{block name="main"}
<div class="row">
    <div class="col-md-12 col-sm-6">
        <div class="widget">
            <header class="widget-header">
                <h4 class="widget-title">聊天室公告</h4>
            </header>
            <hr class="widget-separator">
            <div class="widget-body">
                {:getHtmlCode(config('zz_gg_chat'))}
            </div>
        </div>
    </div>
</div>

<div class="row">
    <div class="col-md-12">
        <div class="talk" style="width: 100%;">
            <div class="talk_title"><span>公共聊天室</span>
                {if condition="isset($prev)"}
                <a href="?page={$prev}"><i class="fa fa-arrow-up"></i>上一页</a>
                {/if}
                {if condition="isset($next)"}
                <a href="?page={$next}"><i class="fa fa-arrow-down"></i>下一页</a>
                {/if}
            </div>
            <div class="talk_record">
                <div id="jp-container" class="jp-container">
                    {volist name="chatList" id="chat"}
                    <div class="talk_recordbox{if condition=" $userInfo.uid eq $chat.uid"}me{/if}">
                        <div class="user">
                            <img src="//q4.qlogo.cn/headimg_dl?dst_uin={$chat.qq}&amp;spec=100">{$chat.user}
                        </div>
                        <div class="talk_recordtextbg">&nbsp;</div>
                        <div class="talk_recordtext">
                            <h3>{$chat.message}</h3>
                            <span class="talk_time">{$chat.addtime}</span>
                        </div>
                    </div>
                    {/volist}
                </div>

            </div>

            <div class="talk_word" style="text-align: center;">
                <form method="post"><input type="hidden" name="action" value="send">
                    <input class="messages emotion" autocomplete="off" value="在这里输入聊天内容"
                           onFocus="if(this.value=='在这里输入聊天内容'){this.value='';}"
                           onblur="if(this.value==''){this.value='在这里输入聊天内容';}" name="message"/>
                    <input class="talk_send" type="submit" title="发送" value="发送"/>
                </form>
            </div>
        </div>
    </div>
</div>
{/block}

{block name="footJs"}
<link rel="stylesheet" type="text/css" href="/assets/chat/jscrollpane1.css"/>
<script src="/assets/chat/jquery-1.4.2.min.js"
        type="text/javascript"></script>
<!--引用jquery-1.4.2.min.js会影响添加表情，不引用jquery-1.4.2.min.js就不支持IE、火狐浏览器的鼠标滚轮插件-->
<!-- the mousewheel plugin -->
<script type="text/javascript"
        src="/assets/chat/jquery.mousewheel.js"></script>
<!-- the jScrollPane script -->
<script type="text/javascript"
        src="/assets/chat/jquery.jscrollpane.min.js"></script>
<script type="text/javascript">
    $('#jp-container').jScrollPane();
    var h1 = $(".jspPane").outerHeight();
    $(".jspPane").css('top', 400 - h1);
    $(".jspDrag").css('top', 200);

</script>
{/block}

